<template>
  <div>
    <div class="text-right padding-lr margin-bottom">
      <el-button size="mini" type="success" @click="saveInfo">保存</el-button>
    </div>
    <el-row :gutter="10" class="text-left padding-lr">
      <el-col :span="6">
        <SelectCard
          :title="`空运专线渠道`"
          :selectOption="priceInfo.ZX"
          :checkOption.sync="checkedZx"
          :priceMap.sync="zxPriceMap"
          :price.sync="priceInfo.zxFormula"
        ></SelectCard>
      </el-col>
      <el-col :span="6">
        <SelectCard
          :selectOption="priceInfo.LCLWeight"
          :checkOption.sync="checkedLCLWeight"
          :priceMap.sync="lclWeightPriceMap"
          :title="`海运拼箱重量渠道`"
          :price.sync="priceInfo.lclWeightFormula"
        ></SelectCard>
      </el-col>
      <el-col :span="6">
        <SelectCard
          :selectOption="priceInfo.LCLVolume"
          :checkOption.sync="checkedLCLVolume"
          :priceMap.sync="lclVolumePriceMap"
          :title="`海运拼箱体积渠道`"
          :price.sync="priceInfo.lclVolumeFormula"
        ></SelectCard>
      </el-col>
      <el-col :span="6">
        <SelectCard
          :selectOption="priceInfo.Express"
          :checkOption.sync="checkedExpress"
          :priceMap.sync="expressPriceMap"
          :title="`快递21KG以上渠道`"
          :price.sync="priceInfo.expressFormula"
        ></SelectCard>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import { ajax } from "@/store/yg/common/utils";
import SelectCard from "./components/SelectCard";

export default {
  props: ["data"],
  components: {
    SelectCard
  },
  data() {
    return {
      checkedZx: [],
      checkedLCLWeight: [],
      checkedExpress: [],
      checkedLCLVolume: [],
      zxPriceMap: {},
      lclWeightPriceMap: {},
      lclVolumePriceMap: {},
      expressPriceMap: {},
      priceInfo: {
        zx: {},
        LCLWeight: {},
        Express: {},
        LCLVolume: {},
        checkCustomerChannelIds: [],
        zxFormula: 0,
        lclWeightFormula: 0,
        lclVolumeFormula: 0,
        expressFormula: 0
      }
    };
  },
  mounted() {
    this.init();
    console.log("this.data.edit :>> ", this.$store.state.edit);
  },
  methods: {
    async init() {
      const data = await ajax("customerGroupUniformPriceMangae", {
        customerGroupId: this.$store.state.edit.id
      });
      if (data.code === 200) {
        this.priceInfo = data.data;
        var priceMap = this.priceInfo.priceMap;
        console.log("this.priceInfo :>> ", this.priceInfo);

        for (const k in this.priceInfo.checkCustomerChannelIds) {
          const i = this.priceInfo.checkCustomerChannelIds[k];
          if (this.priceInfo.ZX[i]) {
            this.checkedZx.push(i);
            this.zxPriceMap[i] = priceMap[i];
          }
          if (this.priceInfo.LCLWeight[i]) {
            this.checkedLCLWeight.push(i);
            this.lclWeightPriceMap[i] = priceMap[i];
          }
          if (this.priceInfo.Express[i]) {
            this.checkedExpress.push(i);
            this.expressPriceMap[i] = priceMap[i];
          }
          if (this.priceInfo.LCLVolume[i]) {
            this.checkedLCLVolume.push(i);
             this.lclVolumePriceMap[i] = priceMap[i];
          }
        }
      }
    },

    handleCheckedCitiesChange(value) {
      let checkedCount = value.length;
      this.checkAll = checkedCount === this.cities.length;
      this.isIndeterminate =
        checkedCount > 0 && checkedCount < this.cities.length;
    },
    async saveInfo() {

      /*if (this.checkedZx.length === 0) {
        this.$message.error("空运专线至少选择一个才能调价");
        return false;
      }
      if (
        this.checkedLCLWeight.length === 0
      ) {
        this.$message.error("海运拼箱渠道至少选择一个才能调价");
        return false;
      }
      if (
        this.checkedLCLVolume.length === 0
      ) {
        this.$message.error("海运体积渠道至少选择一个才能调价");
        return false;
      }
      if (
        this.checkedExpress.length === 0
      ) {
        this.$message.error("快递21KG以上至少选择一个才能调价");
        return false;
      }*/
      const data = await ajax("batchSaveOrUpdateCustomerGroupRelateChannel", {
        customerGroupId: this.$store.state.edit.id,
        customerChannelZXIds: this.checkedZx,
        customerChannelLCLWeightIds: this.checkedLCLWeight,
        customerChannelLCLVolumeIds: this.checkedLCLVolume,
        customerChannelExpressIds: this.checkedExpress,
        unifiedAdjustmentValueZX: this.priceInfo.zxFormula,
        unifiedAdjustmentValueLCLWeight: this.priceInfo.lclWeightFormula,
        unifiedAdjustmentValueLCLVolume: this.priceInfo.lclVolumeFormula,
        unifiedAdjustmentValueExpress: this.priceInfo.expressFormula,
        zxPriceMap: this.zxPriceMap,
        lclWeightPriceMap: this.lclWeightPriceMap,
        lclVolumePriceMap: this.lclVolumePriceMap,
        expressPriceMap: this.expressPriceMap,
      });

      if (data.code === 200) {
        this.$message({
          type: "success",
          message: "保存成功"
        });
      } else {
        // message
        this.$message.error(data.message);
      }
    }
  }
};
</script>

<style scoped>
/deep/ .el-checkbox {
  display: block;
}
</style>
